import React from 'react';
import styles from './index.module.less';
import { useModel } from 'umi';
import { Button } from 'antd';

//看板页
const Dashboard: React.FC = () => {
  const { user } = useModel('user');
  const { initialState } = useModel('@@initialState');
  console.log('initialState', initialState);

  //性能优化案例:useModel可以接受可选的第二个参数,当组件只需要使用Model中的部分参数,而对其他参数的变化不感兴趣的时候,可以传入一个函数进行过滤
  const { add, minus } = useModel('dashboard', (model) => ({
    add: model.increment,
    minus: model.decrement,
  }));
  return (
    <div className={styles.wrap}>
      <h1>看版</h1>
      <div>{user.username}</div>
      <Button onClick={add}>add by 1</Button>
      <Button onClick={minus}>minus by 1</Button>
    </div>
  );
};

export default Dashboard;
